function Page(el,options={}){
    this.el=document.querySelector(el)
    this.options=options
    this.pageTag=this.options.pageTag
    
    this.pageInfo=this.options.pageInfo
    this.totalPage=Math.ceil(this.pageInfo.totalData/this.pageInfo.pageSize)
    this.pageNum=this.pageInfo.pageNum
    this.init()
}

Page.prototype.init=function(){
    //创建分页标签
    this.create()
    //创建分页码
    this.createNum()
    //点击切换
    this.clickE()
}
Page.prototype.create=function(){

    for(let key in this.pageTag){
        let text=this.pageTag[key]
        this.createP('p',text,this.el)
    }
    
}
Page.prototype.createP=function(tagName,content,father){
    let HmObj=document.createElement(tagName)
    // HmObj.style.width='20px'
    // HmObj.style.height='20px'
    HmObj.style.margin='0 5px'
    HmObj.style.padding='0 5px'
    HmObj.innerText=content
    HmObj.style.border='1px solid black'
    HmObj.style.display='inline-block'
    if(content==this.pageNum) HmObj.style.background='pink'
    father.appendChild(HmObj)
}

Page.prototype.createNum=function(){
    let p3Obj=this.el.querySelector('p:nth-of-type(3)')
    p3Obj.style.border='none'
    p3Obj.innerHTML=''
    // for(let i=1;i<=5;i++){
    //     this.createP('p',i,p3Obj)
    // }

//算法
    if(this.totalPage<=7){
        for(let i=1;i<=this.totalPage;i++)  this.createP('p',i,p3Obj)
    }else{
    // 12345...total-1 total       i<5
    // 1234567...total-1 total     i==5
    // 12...num-2 num-1 num num+1 num+2 ...total-1 total       i>5  i<96
    // 12...total-4 total-3 total-2 total-1 total  i>=96

        if(this.pageNum<5){
            for(let i=1;i<=5;i++)  this.createP('p',i,p3Obj)
            this.createP('p','...',p3Obj)
            this.createP('p',this.totalPage-1,p3Obj)
            this.createP('p',this.totalPage,p3Obj)
        
        }else if(this.pageNum==5){
            for(let i=1;i<=7;i++)  this.createP('p',i,p3Obj)
            this.createP('p','...',p3Obj)
            this.createP('p',this.totalPage-1,p3Obj)
            this.createP('p',this.totalPage,p3Obj)
        }else if(this.pageNum>5 && this.pageNum<(this.totalpage-4)){
            for(let i=1;i<=2;i++)  this.createP('p',i,p3Obj)
            this.createP('p','...',p3Obj)
            this.createP('p',this.pageNum-2,p3Obj)
            this.createP('p',this.pageNum-1,p3Obj)
            this.createP('p',this.pageNum,p3Obj)
            this.createP('p',this.pageNum+1,p3Obj)
            this.createP('p',this.pageNum+2,p3Obj)
            this.createP('p','...',p3Obj)
            this.createP('p',this.totalPage-1,p3Obj)
            this.createP('p',this.totalPage,p3Obj)
        
        }else if(this.pageNum>=(this.totalpage-4)){
            for(let i=1;i<=2;i++)  this.createP('p',i,p3Obj)
            this.createP('p','...',p3Obj)
            for(let i=this.totalPage-4;i<=this.totalPage;i++)  this.createP('p',i,p3Obj)
        }
    }
    
}

Page.prototype.clickE=function(){
    this.el.onclick=(evt)=>{
        let e=evt|| window.event
        let target=e.target || e.srcElement

        if( target.nodeName=='P'){
            switch (target.innerText) {
                case this.pageTag.first:
                    this.pageNum=1
                    break;
                case this.pageTag.prev:
                    if(this.pageNum<=1) return
                    this.pageNum--
           
                    break;
                case this.pageTag.next:
                if(this.pageNum>=this.totalPage) return
                    this.pageNum++
                    break;
                case this.pageTag.last:
                    this.pageNum=this.totalPage
                    break;
                default:
                    if(parseInt(this.innerHTML)>0) this.pageNum=Number(target.innerText)
                    break;
            }
        }
        
        this.createNum()
    }
}